﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="ReportKPIManualPage.aspx.cs" Inherits="FBKPI.Pages.ReportKPIManualPage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
        <script type="text/javascript">
            var oTable;
            $(document).ready(function () {
                mainmenu("#nav ul", "#nav li");
                mainmenu("#menu_wrap ul", "#menu_wrap li");

                //datatable section
                oTable = $("#KPITable").dataTable({
                    "oLanguage": {
                        "sZeroRecords": "No records to display",
                        "sSearch": "Search"
                    },
                    "bSort": true,
                    "bPaginate": true,
                    "bAutoWidth": false,
                    "bProcessing": true,
                    "bServerSide": true,
                    "bDestroy": true,
                    "bJQueryUI": true,
                    "sPaginationType": "full_numbers",
                    "bDeferRender": true,
                    "fnServerData": function (sSource, aoData, fnCallback) {
                        $.ajax({
                            "dataType": 'json',
                            "type": "GET",
                            "url": "../Serializer/KPIManualSerializer.ashx?User=" + $("#txt_user").val() + "&Year=" + $("#txt_selectyear").val(),
                            "data": aoData,
                            "success": fnCallback
                        });
                    },
                    "aoColumns": [{
                        "mData": "No"
                    }, {
                        "mData": "KPIDescription"
                    }, {
                        "mData": "isActive"
                    }, {
                        "mData": "Verificator"
                    }, {
                        "mData": "Weight"
                    }, {
                        "mData": "StrategicObjective"
                    }, {
                        "mData": "TargetDescription"
                    }, {
                        "mData": "ID"
                    }, ],
                    "aoColumnDefs": [{
                        "fnRender": function (oObj) {
                            return "<a href=\"#\" onclick=\"ExportManual('" + oObj.aData["ID"] + "', '" + $("#txt_selectyear").val() + "')\"><img src='../images/detail.png' /></a>";
                        },
                        "aTargets": [7]
                    }, {
                        "fnRender": function (oObj) {
                            if (oObj.aData["isActive"] == 'True') {
                                return "<img src='../images/check.png' />"
                            } else {
                                return "<img src='../images/cross.png' />"
                            }
                        },
                        "aTargets": [2]
                    }, {
                        "sClass": "center",
                        "aTargets": [0, 2, 4, 7]
                    }]
                });

                //mark selected row
                $('body').on("click", '#KPITable tbody tr', function () {
                    $('#KPITable tbody tr').removeClass("row_selected");
                    $(this).addClass("row_selected");
                });
                //--------------------end of mark selected row-----------------------------
                $("#KPITable_filter label").after('&nbsp;KPI Year: <input id=\"txt_selectyear\" oninput=\'GetList($(this).val());\' type=\"text\" \>');
                //--------------------end of datatable section-----------------------------------------            

                ExportManual = function (KPI, year) {
                    $.ajax({
                        "dataType": 'json',
                        "type": "POST",
                        "url": "../ReportHandler/KPIManualReportHandler.ashx?User=" + $("#txt_user").val() + "&KPI=" + KPI + "&Year=" + $("#MainContent_txt_year").val(),
                        "success": function (data) {
                            if (data.msg.indexOf('Error') >= 0 || data.msg.indexOf('Invalid') >= 0) {
                                alert(data.msg);
                            }
                            else {
                                document.location = data.msg;
                            }
                            return false;
                        },
                        "error": function (data) {
                            alert(data.msg);
                            return false;
                        }
                    });
                    return false;
                }
            });

            GetList = function (value) {
                if (value.length > 0) {
                    var xx = '0123456789';
                    if (xx.indexOf(value[value.length - 1]) < 0) {
                        $("#txt_selectyear").val(value.toString().replace(value[value.length - 1], ''));
                    }

                    if (value.length == 4) {
                        oTable.fnDraw();
                    }
                }
                else
                { oTable.fnDraw(); }
            }
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div id="kpimanualtable">
        <div>
            <div class="customPageHeader">
                <span class="customPageTitle">KPI Manual</span>
            </div>
            <div class="ui-widget-content">
                <table cellpadding="0" cellspacing="0" class="display" id="KPITable">
                    <thead>
                        <tr>
                            <th>
                                No
                            </th>
                            <th>
                                KPI Description
                            </th>
                            <th>
                                is Active
                            </th>
                            <th>
                                Verificator
                            </th>
                            <th>
                                Weight
                            </th>
                            <th>
                                Strategic Objective
                            </th>
                            <th>
                                Target Description
                            </th>
                            <th>
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>       
            </div>
        </div>
        <br />
    </div>
</asp:Content>
